<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
    <link th:href="@{/erp/assets/css/codemirror.css}" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/font/css/font-awesome.min.css}"/>
    <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/Widget/zTree/css/zTreeStyle/zTreeStyle.css}" type="text/css">
    <link th:href="@{/erp/Widget/icheck/icheck.css}" rel="stylesheet" type="text/css"/>
    <!--[if lte IE 8]>
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace-ie.min.css}"/>
    <![endif]-->
    <script th:src="@{/erp/js/jquery-1.9.1.min.js}"></script>
    <script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
    <script th:src="@{/erp/assets/js/typeahead-bs2.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.dataTables.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.dataTables.bootstrap.js}"></script>
    <script th:src="@{/erp/assets/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/erp/assets/laydate/laydate.js}" type="text/javascript"></script>

    <title>出入库详情</title>
</head>
<body>

<!--详情的界面-->
<div class="add_menber" id="list_menber">
    <ul class=" page-content">
        <div class="Operate_cont clearfix">
            <label class="form-label"><span class="c-red"></span>出/入库单号：</label>
            <div class="formControls" id="ioNo" th:text="${iomNo}"></div>
        </div>
        <div class="Operate_cont clearfix">
            <table class="table table-striped table-bordered table-hover" id="detail-table">
                <thead>
                <tr>
                    <th width="70">序号</th>
                    <th width="100">产品码</th>
                    <th width="100">商品名称</th>
                    <th width="100">出/入库库名</th>
                    <th width="100">出/入库区域</th>
                    <th width="100">出/入库货架</th>
                    <th width="100">出/入库货位</th>
                    <th width="100">出/入库时间</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </ul>
</div>
<!--入库列表-->
<script>
    $(function () {
        /*这一订单编号所有的产品列表*/
        $('#detail-table').DataTable({
            serverSide: true,   //开始服务器分页
            searching: false,
            aoColumnDefs: [
                {"orderable": false, "aTargets": ['_all']}// 制定列不参与排序
            ],
            ajax: {
                url: '/iomWarehouse/page',
                type: 'post',
                data: function (d) {
                    //获取分页信息
                    var searchParams = {
                        start: d.start / 10,
                        length: d.length,
                        iomNo: $("#ioNo").text(),
                    };
                    var data = $.param(searchParams);
                    return data;
                }
            },
            columns: [
                {
                    "data": "iomGoodsno", "createdCell": function (td, cellData, rowData, row, col) {
                        $(td).text(row + 1);
                    }
                },
                {"data": "iomGoodsno"},
                {"data": "iomGoods"},
                {"data": "iomName"},
                {"data": "iomArea"},
                {"data": "iomShelves"},
                {"data": "iomCargoloca"},
                {"data": "iomTime"},
            ],

        });
    })
</script>
</body>
</html>

